<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>查看所有</title>
		<link rel="icon" type="image/x-icon" href="img/favicon.ico" />
		<link rel="stylesheet" type="text/css" href="css/reset.css" />
		<link rel="stylesheet" type="text/css" href="css/top.css" />
		<link rel="stylesheet" type="text/css" href="css/detail.css" />
		<link rel="stylesheet" type="text/css" href="css/bottom.css" />
	</head>
	<body>
		<div id="box">
			<div id="top">
				<div class="top-t">
					<ul>
						<li>
							<a href="#">登录</a>
						</li>
						<li>收藏</li>
						<li>购物袋<span class="count">(0)</span></li>
					</ul>
					<p><span>客户服务</span><img src="img/4.png" class="hid1"><span id="index" style="margin-left: 20px;">回到首页</span></p>
				</div>
				<div class="top-c">
					<img src="img/logo.png">
				</div>
				<div class="top-b">
					<ul>
						<li><a href="#">女士</a></li>
						<li><a href="#">DIVIDED</a></li>
						<li><a href="#">男士</a></li>
						<li><a href="#">儿童</a></li>
						<li><a href="#">家居</a></li>
						<li><a href="#">大减价</a></li>
						<li><a href="#">MAG AZINE</a></li>
					</ul>
					<div class="select">
						<input type="text" placeholder="搜索商品" />
						<img src="img/select.png">
					</div>
				</div>
				<ul class="hidden1">
					<li><a href="#">下载 ANDROID APP</a></li>
					<li><a href="#">下载 IPHONE APP</a></li>
				</ul>
				<div class="hidden2">
					<button type="button"><a href="#">登录</a></button>
					<ul>
						<li>我的帐户</li>
						<li>会员信息</li>
					</ul>
					<p>还不是会员？立刻加入！</p>
				</div>
				<div id="yincang">
					<div class="hidden-women hidden" style="display: none;">
						<div class="con">
							<div>
								<p class="p1">新品</p>
								<ul>
									<li>查看所有</li>
									<li>服饰</li>
									<li>鞋品&配饰</li>
								</ul>
								<p>特惠</p>
								<ul>
									<li>袜子买二送一</li>
									<li>内裤买二送一</li>
								</ul>
								<p>流行风尚</p>
								<ul>
									<li>换季外套</li>
									<li>秋季单品</li>
									<li>经典舒适单品</li>
									<li>编制针织衫</li>
									<li>流行趋势精选</li>
								</ul>
							</div>
							<div>
								<p class="p1">按照品类筛选</p>
								<ul>
									<li>查看所有</li>
									<li>针织衫</li>
									<li>开衫&毛衣</li>
									<li>夹克&外套</li>
									<li>西装&马甲</li>
									<li>连帽衫&卫衣</li>
									<li>衬衫</li>
									<li>裤装</li>
									<li>连衣裙</li>
									<li>基本款</li>
									<li>牛仔裤</li>
									<li>半身裙</li>
									<li>上装</li>
									<li>鞋品</li>
									<li>配饰</li>
									<li>内衣</li>
								</ul>
							</div>
							<div>
								<ul>
									<li>睡衣</li>
									<li>袜子</li>
									<li>运动服</li>
									<li>短裤</li>
									<li>泳装</li>
									<li>连体裤</li>
									<li>孕妇装</li>
									<li>加大码</li>
								</ul>
								<p>场合装扮</p>
								<ul>
									<li>休闲造型</li>
									<li>职场时尚</li>
									<li>派对单品</li>
								</ul>
								<p>系列</p>
								<ul>
									<li>时尚博主皮诺曹儿秋冬同款</li>
								</ul>
							</div>
							<div>
								<ul>
									<li>时尚博主吴佳烨秋冬同款</li>
									<li>宋茜时尚灵感系列</li>
									<li>秋季衣橱</li>
									<li>H&M Studio 2020秋冬系列</li>
									<li>精致的休闲</li>
									<li>宋茜时尚同名系列</li>
									<li>应季主打单品：外套</li>
								</ul>
								<p>通过风格筛选</p>
								<ul>
									<li>Trend</li>
									<li>Premium Quality - 至臻品质系列</li>
									<li>摩登经典</li>
									<li>休闲风格</li>
									<li>Conscious - 可持续时尚</li>
								</ul>
							</div>
						</div>
					</div>
					<div class="hidden-men hidden" style="display: none;">
						<div class="con">
							<div>
								<p class="p1">新品</p>
								<ul>
									<li>服饰</li>
									<li>鞋品&配饰</li>
								</ul>
								<p>流行风尚</p>
								<ul>
									<li>爱丽丝梦游仙境系列</li>
									<li>森女系轻时尚</li>
									<li>小黄人系列</li>
									<li>宝可梦系列</li>
								</ul>
							</div>
							<div>
								<ul>
									<li>史努比系列</li>
									<li>海绵宝宝系列</li>
								</ul>
								<p>按照品类筛选</p>
								<ul>
									<li>查看所有</li>
									<li>连帽衫&卫衣</li>
									<li>基本款</li>
									<li>牛仔裤</li>
									<li>上装</li>
								</ul>
							</div>
							<div>
								<ul>
									<li>开衫&毛衣</li>
									<li>
										裤装 & 紧身裤</li>
									<li>运动服</li>
									<li>连衣裙</li>
									<li>衬衫</li>
									<li>半身裙</li>
									<li>连体裤</li>
									<li>配饰</li>
									<li>鞋品</li>
									<li>短裤</li>
								</ul>
							</div>
							<div>
								<ul>
									<li>泳装</li>
									<li>内衣&睡衣</li>
								</ul>
								<p>系列</p>
								<ul>
									<li>派对连身裙</li>
									<li>万圣节印花单品</li>
									<li>羽绒夹克</li>
									<li>妈妈款裤装</li>
								</ul>
							</div>
						</div>
					</div>
					<div class="hidden-child hidden" style="display: none;height: 400px">
						<div class="con">
							<div>
								<p class="p1">新品</p>
								<ul>
									<li>服饰</li>
									<li>鞋品&配饰</li>
								</ul>
								<p>精选</p>
								<ul>
									<li>加绒单品</li>
									<li>紧跟国潮风</li>
									<li>每周流行色 - 一身黑</li>
									<li>每周流行色 - 高级灰</li>
									<li>每周流行色 - 蓝朋友</li>
								</ul>
								<p>流行风尚</p>
								<ul>
									<li>合作系列服饰&商品</li>
									<li>亚麻服饰</li>
								</ul>
								<p>按照品类筛选</p>
								<ul>
									<li>查看所有</li>
									<li>夹克&外套</li>
									<li>连帽衫&卫衣</li>
									<li>裤装</li>
								</ul>
							</div>
							<div>
								<ul>
									<li>毛衣&开襟绒线衫</li>
									<li>衬衫</li>
									<li>牛仔裤</li>
									<li>T恤衫&背心</li>
									<li>短裤</li>
									<li>精选基本款</li>
									<li>鞋品</li>
									<li>男士西服套装</li>
									<li>泳装</li>
									<li>内衣</li>
									<li>袜子</li>
									<li>配饰</li>
									<li>运动服</li>
									<li>睡衣&居家服</li>
								</ul>
							</div>
							<div>
								<p class="p1">系列</p>
								<ul>
									<li>全新重塑牛仔环保系列</li>
									<li>万圣节连帽衫和 T 恤</li>
									<li>时尚外套</li>
									<li>精选羔羊毛单品</li>
									<li>羽绒夹克</li>
									<li>连帽衫</li>
									<li>今秋型潮风向</li>
									<li>标准版型</li>
									<li>黄轩的秋日探索</li>
									<li>潮流针织衫</li>
									<li>秋冬高翻领</li>
									<li>美利奴羊毛系列</li>
									<li>换季外套</li>
									<li>简单实力派</li>
									<li>防水科技</li>
									<li>棉和羊绒针织系列</li>
									<li>趣味度假衬衫</li>
									<li>泳装短裤</li>
								</ul>
							</div>
							<div>
								<p class="p1">通过风格筛选</p>
								<ul>
									<li>现代经典</li>
									<li>休闲风格</li>
									<li>DIVIDED</li>
									<li>精选基本款</li>
									<li>Premium Quality - 至臻品质系列</li>
									<li>Conscious - 可持续时尚</li>
									<li>Edition</li>
								</ul>
							</div>
						</div>
					</div>
					<div class="hidden-fur hidden" style="display: none;">
						<div class="con">
							<div>
								<p class="p1">网店特惠</p>
								<ul>
									<li>儿童卫衣和套装 - 低至五折</li>
									<li>婴儿可爱套装 - 低至五折</li>
									<li>婴儿连衣裙和裤子 - 低至五折</li>
								</ul>
								<p>卡通和漫画</p>
								<ul>
									<li>史努比系列</li>
									<li>冰雪奇缘系列</li>
									<li>每周流行色 - 一身黑</li>
									<li>每周流行色 - 高级灰</li>
									<li>每周流行色 - 蓝朋友</li>
								</ul>
								<p>冰雪奇缘系列</p>
								<ul>
									<li>中国限定</li>
								</ul>
							</div>
							<div>
								<ul>
									<li>超值多件装</li>
									<li>万圣节预览</li>
								</ul>
							</div>
							<div>
								<p class="p1">按照品类筛选</p>
								<ul>
									<li>新生儿尺码0-9个月</li>
									<li>女婴 4个月-4岁</li>
									<li>男婴 4个月-4岁</li>
									<li>女孩18个月-10岁</li>
									<li>男孩18个月-10岁</li>
									<li>女孩 8岁-14岁+</li>
									<li>男孩 8岁-14岁+</li>
									<li>查看所有</li>
								</ul>
								<p>系列</p>
								<ul>
									<li>全新婴儿装</li>
								</ul>
							</div>
							<div>
								<ul>
									<li>搞怪时刻到</li>
									<li>秋季亲子装</li>
									<li>秋季婴儿装</li>
								</ul>
								<p>通过风格筛选</p>
								<ul>
									<li>牛仔系列</li>
									<li>Conscious - 可持续时尚</li>
									<li>儿童房</li>
									<li>Baby Exclusive</li>
									<li>卡通和漫画</li>
								</ul>
							</div>
						</div>
					</div>
					<div class="hidden-discount hidden" style="display: none;">
						<div class="con">
							<div>
								<p class="p1">新品</p>
								<ul>
									<li>家居和室内产品</li>
								</ul>
								<p>按照房间筛选</p>
								<ul>
									<li>卧室</li>
									<li>客厅</li>
									<li>浴室</li>
									<li>儿童房</li>
									<li>厨房</li>
									<li>Classic Collection</li>
								</ul>
								<p>按照品类筛选</p>
								<ul>
									<li>查看所有</li>
									<li>靠垫</li>
									<li>床上用品</li>
								</ul>
							</div>
							<div>
								<ul>
									<li>毛巾</li>
									<li>浴室防滑垫</li>
									<li>浴帘</li>
									<li>毯子</li>
									<li>窗帘</li>
									<li>地毯</li>
									<li>储藏</li>
									<li>装饰品</li>
									<li>玻璃器皿</li>
									<li>瓷器</li>
									<li>厨具</li>
									<li>桌布</li>
									<li>茶几布</li>
									<li>茶巾</li>
									<li>餐巾</li>
								</ul>
							</div>
							<div>
								<ul>
									<li>围裙</li>
									<li>浴袍</li>
									<li>家居服</li>
								</ul>
								<p>系列</p>
								<ul>
									<li>欢乐过圣诞</li>
									<li>节日餐桌</li>
									<li>教你如何装饰你的床</li>
									<li>舒适卧室与浴室单品</li>
									<li>整理浴室</li>
									<li>太空主题儿童房</li>
									<li>秋日家居风</li>
									<li>儿童房</li>
									<li>全新毛巾</li>
									<li>趣味收纳单品</li>
								</ul>
							</div>
							<div>
								<ul>
									<li>用心打造好陶瓷</li>
									<li>玄关设计秘诀</li>
									<li>家居经典格调系列</li>
									<li>森林风儿童房单品</li>
									<li>重新巧妙布置</li>
									<li>餐桌大变样</li>
									<li>儿童夏日系列</li>
									<li>经典浴巾</li>
								</ul>
								<p>通过风格筛选</p>
								<ul>
									<li>Conscious - 可持续时尚</li>
									<li>Premium Quality - 至臻品质系列</li>
									<li>Classic Collection</li>
								</ul>
							</div>
						</div>
					</div>
					<div class="hidden-mag hidden" style="display: none;height: 470px">
						<div class="con">
							<div>
								<p class="p1">女士</p>
								<ul>
									<li>查看所有</li>
									<li>夹克&外套</li>
									<li>西装&马甲</li>
									<li>针织衫</li>
									<li>裤装</li>
									<li>连帽衫&卫衣</li>
									<li>牛仔裤</li>
									<li>连衣裙</li>
									<li>半身裙</li>
									<li>衬衫</li>
									<li>上装</li>
									<li>短裤</li>
									<li>基本款</li>
									<li>Trend</li>
									<li>Premium Quality - 至臻品质系列</li>
									<li>鞋品</li>
									<li>内衣</li>
									<li>开衫&毛衣</li>
									<li>配饰</li>
									<li>泳装</li>
									<li>连体裤</li>
									<li>睡衣</li>
									<li>袜子</li>
								</ul>
							</div>
							<div>
								<ul>
									<li>运动服</li>
									<li>孕妇装</li>
									<li>加大码</li>
								</ul>
								<p>DIVIDED</p>
								<ul>
									<li>查看所有</li>
									<li>连帽衫&卫衣</li>
									<li>基本款</li>
									<li>夹克&外套</li>
									<li>上装</li>
									<li>牛仔裤</li>
									<li>裤装&紧身裤</li>
									<li>连衣裙</li>
									<li>半身裙</li>
									<li>衬衫</li>
									<li>开衫&毛衣</li>
									<li>连体裤</li>
									<li>配饰</li>
									<li>鞋品</li>
									<li>短裤</li>
									<li>泳装</li>
									<li>内衣&睡衣</li>
								</ul>
							</div>
							<div>
								<p class="p1">男士</p>
								<ul>
									<li>查看所有</li>
									<li>连帽衫&卫衣</li>
									<li>T恤衫&背心</li>
									<li>裤装</li>
									<li>衬衫</li>
									<li>夹克&外套</li>
									<li>牛仔裤</li>
									<li>短裤</li>
									<li>鞋品</li>
									<li>套衫&开襟绒线衫</li>
									<li>男士西服套装</li>
									<li>运动服</li>
									<li>泳装</li>
									<li>配饰</li>
									<li>基本款</li>
									<li>Premium Quality - 至臻品质系列</li>
								</ul>
								<p>儿童</p>
								<ul>
									<li>新生儿 0-9个月</li>
									<li>女婴 4个月-4岁</li>
									<li>男婴 4个月-4岁</li>
									<li>女孩18个月-10岁</li>
									<li>男孩18个月-10岁</li>
								</ul>
							</div>
							<div>
								<ul>
									<li>女孩 8岁-14岁+</li>
									<li>男孩 8岁-14岁+</li>
									<li>查看所有</li>
								</ul>
								<p>家居</p>
								<ul>
									<li>查看所有</li>
									<li>3折专区</li>
									<li>5折专区</li>
									<li>卧室</li>
									<li>儿童房</li>
									<li>客厅</li>
									<li>浴室</li>
									<li>厨房用品</li>
									<li>床上用品</li>
									<li>靠垫</li>
									<li>毛毯</li>
									<li>窗帘</li>
									<li>装饰品</li>
									<li>烛台</li>
									<li>桌旗</li>
									<li>地毯</li>
									<li>储藏</li>
								</ul>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div id="middle">
				<hr style="display: inline-block;width: 35%; vertical-align: middle;">
				<div style="font-size: 12px;" class="line">
					<a href="#">HM.COM.CN </a> &nbsp;/&nbsp;
					<a href="#">女士 </a> &nbsp;/&nbsp;
					<a href="#">按照品类筛选 </a> &nbsp;/&nbsp;
					<a href="#">针织衫 </a>
				</div>
				<hr style="display: inline-block;;width: 35%; vertical-align: middle;">
				<div class="middle">
					<div class="middle-left">
						<p>新品</p>
						<ul>
							<li>查看所有</li>
							<li>服饰</li>
							<li>鞋品&配饰</li>
						</ul>
						<p>特惠</p>
						<ul>
							<li>袜子买二送一</li>
							<li>内裤买二送一</li>
						</ul>
						<p>流行风尚</p>
						<ul>
							<li>换季外套</li>
							<li>秋季单品</li>
							<li>经典舒适单品</li>
							<li>编制针织衫</li>
							<li>流行趋势精选</li>
						</ul>
						<p>按照品类筛选</p>
						<ul>
							<li>查看所有</li>
							<li>针织衫</li>
							<li>开衫&毛衣</li>
							<li>夹克&外套</li>
							<li>西装&马甲</li>
							<li>连帽衫&卫衣</li>
							<li>衬衫</li>
							<li>裤装</li>
							<li>连衣裙</li>
							<li>基本款</li>
							<li>牛仔裤</li>
							<li>半身裙</li>
							<li>上装</li>
							<li>鞋品</li>
							<li>配饰</li>
							<li>内衣</li>
							<li>睡衣</li>
							<li>袜子</li>
							<li>运动服</li>
							<li>短裤</li>
							<li>泳装</li>
							<li>连体裤</li>
							<li>孕妇装</li>
							<li>加大码</li>
						</ul>
						<p>场合装扮</p>
						<ul>
							<li>休闲造型</li>
							<li>职场时尚</li>
							<li>派对单品</li>
						</ul>
						<p>系列</p>
						<ul>
							<li>时尚博主皮诺曹儿秋冬同款</li>
							<li>时尚博主吴佳烨秋冬同款</li>
							<li>宋茜时尚灵感系列</li>
							<li>秋季衣橱</li>
							<li>H&M Studio 2020秋冬系列</li>
							<li>精致的休闲</li>
							<li>宋茜时尚同名系列</li>
							<li>应季主打单品：外套</li>
						</ul>
						<p>通过风格筛选</p>
						<ul>
							<li>Trend</li>
							<li>Premium Quality - 至臻品质系列</li>
							<li>摩登经典</li>
							<li>休闲风格</li>
							<li>Conscious - 可持续时尚</li>
						</ul>
					</div>
					<div class="middle-con">
						<p>针织衫</p>
						<div class="middle-c-t">
							<ul>
								<li>分类方式<img src="img/jt.png" ></li>
								<li>产品类型<img src="img/jt.png" ></li>
								<li>造型<img src="img/jt.png" ></li>
								<li>尺码<img src="img/jt.png" ></li>
								<li>颜色<img src="img/jt.png" ></li>
								<li><img src="img/kz.png" style="margin-right: 10px;margin-left: 0;width: 15px;">所有筛选条件</li>
							</ul>
							<div class="right">
								<span class="span1">895 产品</span>
								<span class="span2">款式</span>
								<span class="span3">产品</span>
								<img src="img/two.png" >
								<img src="img/three.png" >
							</div>
						</div>
						<dl id="template">
							<dt style="cursor: pointer;">
								<a href=""><img src="" class="img-c"></a>
								<span>♥</span>
							</dt>
							<dd style="cursor: pointer;"><a href=""></a></dd>
							<dd></dd>
							<dd style="cursor: pointer;"><span></span><span></span></dd>
							<dd></dd>
						</dl>
						<div class="middle-img">
						</div>
						<div class="middle-b-c">
							<p>正在显示<span></span>条，共<span></span>商品</p>
							<button type="button">显示更多</button>
						</div>
					</div>
				</div>
			</div>
			<div id="bottom">
				<div class="bottom-t">
					<div class="bottom1">
						<p>部门</p>
						<ul>
							<li>女士</li>
							<li>男士</li>
							<li>儿童</li>
							<li>家居</li>
						</ul>
					</div>
					<div class="bottom1">
						<p>公司信息</p>
						<ul>
							<li>在H&M的职业发展</li>
							<li>关于H&M集团</li>
							<li>可持续性</li>
							<li>媒体</li>
							<li>投资者关系</li>
							<li>公司治理</li>
						</ul>
					</div>
					<div class="bottom1">
						<p>帮助</p>
						<ul>
							<li>客户服务</li>
							<li>我的账户</li>
							<li>隐私及法律条款</li>
							<li>联系我们</li>
						</ul>
					</div>
					<div style="width: 240px;">
						<p>立即加入</p>
						<ul>
							<li>成为会员获得9折优惠+免费送货福利，用于第二次购物!</li>
							<li><button type="button">阅读更多</button></li>
						</ul>
					</div>
				</div>
				<div class="bottom-c">
					<img src="img/wb.png" >
					<img src="img/yk.png" >
					<img src="img/xhs.png" >
				</div>
				<div class="bottom-i">
					<dl>
						<dd>关注H&M官方微信小程序</dd>
						<dt><img src="img/4.1.png"></dt>
					</dl>
					<dl>
						<dd>关注H&M官方微信公众号</dd>
						<dt><img src="img/4.2.png"></dt>
					</dl>
					<dl>
						<dd>关注H&M官方微博</dd>
						<dt><img src="img/4.3.png"></dt>
					</dl>
					<dl>
						<dd>下载H&M 官方 APP</dd>
						<dt><img src="img/4.4.png"></dt>
					</dl>
				</div>
				<div class="bottom-l">
					H&M 成立于1947年，现已发展成为一个世界知名的时尚品牌。H&M的宗旨是以可持续的方式和优惠的价格，提供时尚与品质。本网站的所有内容均受版权保护，所有权归海恩斯莫里斯（上海）商业有限公司所有。
				</div>
				<div class="bottom-e">
					<img src="img/gongshang.jpg" >
					<a href="#">上海工商</a>
					<img src="img/gongan.png" >
					<a href="#"> 沪公网安备 31010102006316号&nbsp;&nbsp;&nbsp;沪ICP备09046754号 </a>&nbsp;&nbsp;&nbsp;
					<img src="img/dajia.png" >
					<a href="#">网购（订餐）大家评</a>
				</div>
				<div class="bottom-hm">
					<img src="img/hm.png" >
				</div>
				<div class="bottom-b">
					<a href="#">中文&nbsp;&nbsp;&nbsp;</a>
					<img src="img/4.5.png" style="cursor: pointer;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; |&nbsp;&nbsp;
					<span>换地区</span> &nbsp;&nbsp;|&nbsp;&nbsp;
					￥
				</div>
			</div>
		</div>
		<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/top.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/Ip.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/yanzheng.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$.ajax({
				url:`${IP}/find`,
				success:function(data){
					for(let i = 0; i < data.length; i++){
						let clone = $("#template").clone()
						clone.attr("id","")
						clone.find("img").attr("src",data[i].img)
						clone.find("dd").eq(0).find("a").html(data[i].title)
						clone.find("a").attr("href",`${IP}/information.html?id=${data[i].id}`)
						clone.find("dd").eq(1).html(`￥${data[i].price}.00`)
						if(data[i].isNew === "1"){
							clone.find("dd").eq(3).html("新品")
						}else{
							clone.find("dd").eq(3).html("")
						}
						clone.appendTo($(".middle-img"))
					}
					$(".middle-b-c span").html(data.length+1)
				}
			})
			
		</script>
	</body>
</html>
